<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>input</h1>
    <hr>

    <input type="text" name="name" id="s">
    
    <hr>
    <br>
    <button onclick="selectAll()">全选</button>
    <button onclick="copyContent()">全选复制</button>
    
    <button class="btn" data-clipboard-target="#content">全选复制(插件clip)</button>

    <br>


    <textarea name="weibo" id="content" cols="100" rows="30">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam cum, impedit eos nesciunt voluptatum possimus rerum dicta quam sint non cupiditate, alias id saepe nulla exercitationem molestiae, inventore quidem sequi minima repellat! Rem labore quaerat adipisci! Inventore delectus mollitia et non. Quaerat debitis eveniet illum ratione, non, esse sapiente repellat harum excepturi provident ut rem eius illo quia delectus vitae dignissimos maiores assumenda! Vero sapiente voluptatum animi. Aspernatur sapiente vel quos praesentium eius commodi laboriosam maxime voluptatibus quae molestiae, nulla, sed a non enim rerum iure tempore ullam adipisci provident inventore cumque optio fuga facilis illo sint! Porro expedita, alias ab similique. Libero alias labore enim velit, consequatur nostrum, beatae sequi aut esse unde laudantium quidem culpa ratione maiores accusamus modi illo a nam magni. Quaerat officiis nulla, quam, ut nemo ullam obcaecati neque vitae porro voluptate mollitia omnis sit, deleniti. Iusto, dolorum dicta, in laborum et deserunt non voluptatibus molestiae nesciunt fugiat doloribus suscipit earum quaerat corrupti culpa, placeat veniam illum! Dolore culpa odio animi quae veritatis laboriosam. Provident eum sed, optio consectetur esse molestias vero in modi sequi, velit alias animi nam eaque. Velit fugiat dolores veritatis est perferendis itaque, sequi quisquam assumenda excepturi magni laboriosam, ad cupiditate quasi repudiandae facere quas id et porro amet dolor consequatur quae voluptas. Vel debitis eos at, esse, labore ad quis qui perferendis iste, tempore beatae voluptas totam omnis natus aliquid, libero iure et placeat culpa dignissimos officiis porro dolorem deserunt magnam. Aut veniam non ducimus beatae animi maiores ratione obcaecati molestiae ipsa porro rerum cumque fugiat, natus quia repellat ut dolorem, quam suscipit quibusdam. Distinctio eveniet repudiandae nobis quae, voluptas quod quaerat, quos adipisci voluptates vitae ea veritatis et modi, nam culpa error 
    <script>
        // focus() 在文本域上设置焦点。 
        var s = document.getElementById('s');
        s.focus();

        // blur() 从文本域上移开焦点。 
        // select() 选取文本域中的内容。 
        function selectAll() {
            content.select();
        }

        // 全选 复制
        function copyContent() {
            // 判断 剪切板对象 是否可用
            if (window.clipboardData) {
                // 可用
                clipboardData.setData('text', content.value);
                alert('已复制到剪切板!');
            } else {
                // 不可用
                content.select();
                alert('请按 Ctrl + C 复制选中内容..');
            }
        }

        var clipboard = new ClipboardJS('.btn');

        clipboard.on('success', function (e){
            alert('已通过插件 完成复制');
        });

    </script>
</body>
</html>